﻿@model cloudscribe.Core.Web.ViewModels.RoleAdmin.RoleMemberListViewModel
@using cloudscribe.Web.Pagination
@addTagHelper "*, cloudscribe.Web.Pagination"
@addTagHelper "*, cloudscribe.Web.Common"
@using cloudscribe.Core.Web
@using Microsoft.Extensions.Options
@using Microsoft.Extensions.Localization
@inject IStringLocalizer<CloudscribeCore> sr
@{ 
    ViewData["BodyClass"] = "admin-section role-members";
}
<h2>@Model.Heading1</h2>
<h3>@Model.Heading2</h3>
<form class="form-inline" role="form" asp-controller="RoleAdmin" asp-action="RoleMembers" method="get">
    <input name="siteId" value="@Model.Role.SiteId" type="hidden" />
    <input name="roleId" value="@Model.Role.Id" type="hidden" />
    <div class="input-group">
        <input name="searchInput" type="search" value="@Model.SearchQuery" class="form-control" />
        <span class="input-group-btn">
            <button type="submit" value="Search" class="btn btn-default">@sr["Search"]</button>
        </span>
    </div>
</form>
    <div>
        <table class="table table-striped">
            <tr>
                <th>
                    <a id="parentModalLink" class="btn btn-xs btn-default" asp-action="RoleNonMembers" asp-controller="RoleAdmin"
                       asp-route-siteId="@Model.Role.SiteId"
                       asp-route-roleId="@Model.Role.Id"
                       bs-modal-link="true" bs-modal-id='@Model.Role.Id.ToString()'>@sr["Add User"]</a>
                </th>
                <th>
                   @sr["Email"]
                </th>
                <th>
                    @sr["Login Name"]
                </th>
                <th>
                    @sr["Display Name"]
                </th>
                <th>
                    @sr["First Name"]
                </th>
                <th>
                    @sr["Last Name"]
                </th>
            </tr>
            @foreach (var item in Model.Members.Data)
            {
                <tr>
                    <td>
                        <button type="button" class="btn btn-danger btn-xs" data-toggle="modal" data-target="@("#confirmModal" + item.Id)">
                            @sr["Remove"]
                        </button>
                        <form asp-controller="RoleAdmin" asp-action="RemoveUser">
                            <input name="SiteId" value="@Model.SiteId" type="hidden" />
                            <input name="roleId" value="@Model.Role.Id" type="hidden" />
                            <input name="userId" value="@item.Id" type="hidden" />
                            <div class="modal fade" id="@("confirmModal" + item.Id)" tabindex="-1" role="dialog" aria-labelledby="@("confirmHeading" + item.Id)">
                                <div class="modal-dialog modal-sm" role="document">
                                    <div class="modal-content">
                                        <div class="modal-header">
                                            <button type="button" class="close" data-dismiss="modal" aria-label='@sr["Close"]'><span aria-hidden="true">&times;</span></button>
                                            <h4 class="modal-title" id="@("confirmHeading" + item.Id)">@sr["Confirm Remove User From Role"]</h4>
                                        </div>
                                        <div class="modal-body">
                                            @string.Format(sr["Are you sure you want to remove {0} from the role {1}?"], item.DisplayName, Model.Role.RoleName)
                                        </div>
                                        <div class="modal-footer">
                                            <button type="button" class="btn btn-default" data-dismiss="modal">@sr["Cancel"]</button>
                                            <input type="submit" value='@sr["Remove"]' class="btn btn-danger btn-ok" />
                                        </div>
                                    </div>
                                </div>
                            </div>


                        </form>
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.Email)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.UserName)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.DisplayName)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.FirstName)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.LastName)
                    </td>
                </tr>
            }
        </table>
        <div>
            <cs-pager 
                      asp-action="RoleMembers" asp-controller="RoleAdmin"
                      asp-route-siteId="@Model.Role.SiteId"
                      asp-route-roleId="@Model.Role.Id"
                      asp-route-searchinput="@Model.SearchQuery"
                      asp-route-pagesize="@Model.Members.PageSize"
                      cs-paging-pagesize="@Model.Members.PageSize"
                      cs-paging-pagenumber="@Model.Members.PageNumber"
                      cs-paging-totalitems="@Model.Members.TotalItems"
                      cs-first-page-title='@sr["First Page"]'
                      cs-last-page-title='@sr["Last Page"]'
                      cs-previous-page-title='@sr["Previous page"]'
                      cs-next-page-title='@sr["Next page"]'
                      ></cs-pager>
        </div>
    </div>

    <div class="modal fade" id="confirmAddRoleModal" tabindex="-1" role="dialog" aria-labelledby="confirmHeading" style="z-index:999999;">
        <div class="modal-dialog modal-sm" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label='@sr["Close"]'><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="confirmHeading">@sr["Confirm Add User To Role"]</h4>
                </div>
                <div class="modal-body">
                    <span id="spnMessage"></span>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">@sr["Cancel"]</button>
                    <input id="btnAddUser" type="button" value='@sr["Add"]' class="btn btn-success btn-ok" />
                </div>
            </div>
        </div>
    </div>

 @section Scripts {
@{await Html.RenderPartialAsync("_UnobtrusiveValidationScriptsPartial"); }
<script src="~/cr/js/jquery.unobtrusive-ajax.min.js"></script>
<script src="~/cr/js/cloudscribe-modaldialog-bootstrap.min.js"></script>
<script src="~/cr/js/cloudscribe-rolemember-page.js"></script>
     
 }
